<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>图像</title>
	</head>
	<body>
		<canvas id="c1" width="500" height="500"></canvas>
		<script>
			var c1 = document.getElementById('c1');
			var ctx = c1.getContext('2d');
			
			// 绘制图像
		    // drawImage(图片对象,裁剪位置x/y,裁剪的宽/高,x/y位置,图片宽/高)
			var img = new Image();
			img.src = 'img/img.jpg';
			img.onload = function(){
				ctx.drawImage(img,0,0,300,300,0,0,500,500);
				ctx.font = '16px 微软雅黑';
				ctx.fillText('@一只野萌君',400,490);
			}
		</script>
	</body>
</html>
